import React, { Component } from 'react'
import {withRouter} from 'react-router-dom'
import {countTotalNum} from '../../store/actionCreator'
import { connect } from 'react-redux'
 class ProductHeader extends Component {
   componentDidMount(){
     let CartList=JSON.parse(window.localStorage.getItem('CartList'))||[]
     this.props.countTotal(CartList)
   }
  render() {
    return (
      <div className='ProductHeader'>
        <div className="ProductHeaderLeft">
          <span className='iconfont icon-shouye' onClick={()=>{
            this.props.history.push('/')
          }}></span>
        </div>
        <div className="ProductHeaderMid">
        </div>
        <div className="ProductHeaderRight">
          <span className='iconfont icon-fangdajing' onClick={()=>{}}></span>
          <span className='iconfont icon-gouwuche' onClick={()=>{
             this.props.history.push('/cart')
          }}>
            <span className='m-badge1'>{this.props.totalNum?this.props.totalNum:''}</span>
          </span>
        </div>
      </div>
    )
  }
}
const mapStateToProps = (state) => {
  return {
    totalNum: state.getIn(['productReducer', 'totalNum']),
    CartList: state.getIn(['productReducer', 'CartList']),
  }
}
const mapDispatchToProps = (dispatch) => {
  return {    
    /* 计算购物总数开始 */
    countTotal:(arr)=>{
      var num=0
      arr.forEach(v=>{
        num+=v.num
      })
      dispatch(countTotalNum(num))
    }

    /* 计算购物总数结束 */
  }
}
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(withRouter(ProductHeader))